<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html lang="zh-CN">
<head>
    <meta charset="GB18030">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <link rel="stylesheet" href="${pageContext.request.contextPath}/resources/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resources/css/font-awesome.min.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resources/css/main.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/resources/css/carousel.css">
    <style>
        .tree li {
            list-style-type: none;
            cursor: pointer;
        }

        table tbody tr:nth-child(odd) {
            background: #F4F4F4;
        }

        table tbody td:nth-child(even) {
            color: #C00;
        }

        th {
            text-align: center
        }
        .xxspan {
            display: none;
            color: #d43f3a;
        }
    </style>
</head>

<body>
<div class="navbar-wrapper ">
    <%--动态导入另一个jsp页面，作用：将公共使用的部分提取出来，然后使用动态导入
              动态导入是不会导入include页面的编译指令的，而是仅仅将被导入页面的body内容插入本页面。--%>
    <jsp:include page="admin-header.jsp"></jsp:include>
</div>
<div class="container-fluid">
    <div class="row">
        <%--动态导入另一个jsp页面，作用：将公共使用的部分提取出来，然后使用动态导入
                     动态导入是不会导入include页面的编译指令的，而是仅仅将被导入页面的body内容插入本页面。--%>
        <jsp:include page="admin-left.jsp"></jsp:include>
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
            <div class="panel panel-default">
                <div class="panel-heading">
                    <h3 class="panel-title"><i class="glyphicon glyphicon-th"></i> 新增管理员</h3>
                </div>
                <div class="panel-body">
                    <form id="addOrder" class="form-horizontal" role="form" action="/tbAdmin/addAdmin"
                          method="post"
                          enctype="multipart/form-data">
                        <div class="form-group ">
                            <label>
                                账号
                                <span class="xxspan" id="sp">账号不能为空</span>
                            </label>
                            <input id="adminAccount" name="adminAccount" type="text" maxlength="255"
                                   class="form-control"
                                   placeholder="填写登录账号"/>
                        </div>
                        <div class="form-group ">
                            <label>
                                姓名
                                <span class="xxspan" id="sp2">不能为空</span>
                            </label>
                            <input id="adminName" name="adminName" type="text" maxlength="255"
                                   class="form-control"
                                   placeholder="填写姓名"/>
                        </div>
                        <div class="form-group ">
                            <label>
                                密码
                                <span class="xxspan" id="sp3">数字字母组成最少6位</span>
                            </label>
                            <input id="adminPassword" name="adminPassword" type="password" maxlength="50"
                                   class="form-control" placeholder="填写密码"/>
                        </div>
                        <div class="form-group ">
                            <label>
                                密码验证
                                <span class="xxspan" id="sp4">密码不一致</span>
                            </label>
                            <input id="rePassword" name="rePassword" type="password" maxlength="50"
                                   class="form-control" placeholder="再次输入密码"/>
                        </div>
                        <div class=" form-group">
                            <input id="addInt" type="submit" class="btn btn-primary" value="提交申请"/>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div> <!-- /container -->
</div>
<script src="${pageContext.request.contextPath}/resources/jquery/jquery-2.1.1.min.js"></script>
<script src="${pageContext.request.contextPath}/resources/bootstrap/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/resources/script/docs.min.js"></script>
<script src="${pageContext.request.contextPath}/resources/script/back-to-top.js"></script>

</body>
<script>
    $(function () {

        $("[data-toggle='tooltip']").tooltip();

        $(".list-group-item").click(function () {
            if ($(this).find("ul")) {
                $(this).toggleClass("tree-closed");
                if ($(this).hasClass("tree-closed")) {
                    $("ul", this).hide("fast");
                } else {
                    $("ul", this).show("fast");
                }
            }
        });

        $('input').focus(function () {
            $('input').css("border-color", "#CCC");
        });

        $('#addInt').click(function panduan() {
            console.log($("#adminAccount").val().length);
            //判断账户不能为空
            if ($("#adminAccount").val() == "") {
                $("#adminAccount").css("border-color", "red");
                $('#sp').show();
                return false;
            } else {
                $('#sp').attr("display", 'none');
            }
            //判断姓名不能为空
            if ($("#adminName").val() == "") {
                $("#adminName").css("border-color", "red");
                $('#sp2').show();
                return false;
            } else {
                $('#sp2').attr("display", 'none');
            }
            //判断密码格式是否正确
            if ($("#adminPassword").val() == "" || $("#adminPassword").val().length < 6) {
                $("#adminPassword").css("border-color", "red");
                $('#sp3').show();
                return false;
            } else {
                $('#sp3').attr("display", 'none');
            }
            //判断密码验证是否合理
            if ($("#rePassword").val() == "" || $("#rePassword").val().length < 6 || $("#adminPassword").val() != $("#rePassword").val()) {
                $("#rePassword").css("border-color", "red");
                $('#sp4').show();
                return false;
            } else {
                $('#sp4').attr("display", 'none');
            }


        })


    })
</script>
</html>
